<template>
  <view class="empty-recruit">
    <image class="empty-recruit__image" src="/static/images/empty/empty_recruit.png" mode="aspectFit"></image>
    <view class="empty-recruit__text">{{ text }}</view>
    <button v-if="showButton" class="empty-recruit__button" @click="handleAction">{{ buttonText }}</button>
  </view>
</template>

<script setup>
defineProps({
  text: {
    type: String,
    default: '暂无招聘信息'
  },
  showButton: {
    type: Boolean,
    default: false
  },
  buttonText: {
    type: String,
    default: '刷新'
  }
});

const emit = defineEmits(['action']);

const handleAction = () => {
  emit('action');
};
</script>

<style lang="scss" scoped>
.empty-recruit {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
  
  &__image {
    width: 120px;
    height: 120px;
    margin-bottom: 16px;
  }
  
  &__text {
    font-size: 14px;
    color: #999;
    margin-bottom: 20px;
  }
  
  &__button {
    width: 120px;
    height: 40px;
    line-height: 40px;
    background-color: #1890ff;
    color: #ffffff;
    font-size: 14px;
    border-radius: 20px;
  }
}
</style>
